<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<div class="row">
    <div class="col-lg-12">
        <div class="panel panel-default">
            <form th:id="form-data" th:action="@{/pwd/submit}" method="post">
                <div class="panel-body">

                    <div class="form-group clear">
                        <label class="col-sm-1 control-label search-label">原密码</label>
                        <div class="col-sm-4 col-sm-inp">
                            <input type="password" class="form-control" name="oldPassword" id="oldPassword" maxlength="120" onfocus="clearErrorMsg()" placeholder="请输入原密码" />
                        </div>
                    </div>

                    <div class="form-group clear">
                        <label class="col-sm-1 control-label search-label">新密码</label>
                        <div class="col-sm-4 col-sm-inp">
                            <input type="password" class="form-control" name="newPassword" id="newPassword" maxlength="120" onfocus="clearErrorMsg()" placeholder="请输入新密码" />
                        </div>
                    </div>

                    <div class="form-group clear">
                        <label class="col-sm-1 control-label search-label">确认密码</label>
                        <div class="col-sm-4 col-sm-inp">
                            <input type="password" class="form-control" name="confirmPassword" id="confirmPassword" maxlength="120" onfocus="clearErrorMsg()" placeholder="请输入确认密码" />
                        </div>
                    </div>

                    <div class="clear errorMsg" id="errorMsg"></div>
                    <div class="panel-heading">
                        <div>
                            <button type="button" class="btn btn-sm btn-success" onclick="checkParams()">确定</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<script th:inline="javascript">

    function checkParams() {

        if($.trim($("#oldPassword").val()).length === 0) {
            $("#errorMsg").html("请填写原密码");
            return;
        }

        if($.trim($("#newPassword").val()).length === 0) {
            $("#errorMsg").html("请填写新密码");
            return;
        }

        if($.trim($("#confirmPassword").val()).length === 0) {
            $("#errorMsg").html("请填写确认密码");
            return;
        }

        if($.trim($("#newPassword").val()) != $.trim($("#confirmPassword").val())) {
            $("#errorMsg").html("请输入相同的确认密码");
            return;
        }

        let form = $("#form-data");
        let url = form.attr("action");

        $.post(url, form.serialize(), function (data) {
            data = eval('(' + data + ')');
            if (data.success) {
                document.getElementById("form-data").reset();
                alert("密码修改成功");
            } else { $("#errorMsg").html(data.message); }

        })
    }

</script>
</html>